<!--
 * @Author: zhangjingyu
 * @Date: 2020-12-01 17:47:57
 * @LastEditors: zhangjingyu
 * @LastEditTime: 2020-12-28 14:10:21
 * @FilePath: \vprisk10.14\src\views\Others\notification.vue
 * @Description: 消息通知
-->
<template>
  <div>
    <el-row :gutter="20">
      <el-col :span="6">
        <div>
          <el-input
            v-model="searchStr"
            placeholder="消息搜索..."
            @keydown.enter.native="searchFuncByStr"
          ></el-input>
        </div>
        <vp-tree
          :data="treeData"
          :props="defaultProps"
          @node-click="handleNodeClick"
          default-expand-all
          check-strictly
          ref="configTree"
          node-key="id"
          :expand-on-click-node="false"
        ></vp-tree>
      </el-col>
      <el-col :span="18">
        <div class="cgx" v-if="currentType!='config'&&currentType!='write'">
          <upper-template noIcon>
            <div slot="buttonArea">
              <template
                v-if="
                  currentType != 'config' &&
                    currentType != 'draft' &&
                    currentType != 'right' &&
                    currentType != 'sent'
                "
              >
                <el-button @click="tagRead">标记已读</el-button>
                <el-button @click="tagReadAll">全部标记已读</el-button>
                <el-button @click="delFunc">删除</el-button>
              </template>
              <el-button @click="delDraft" v-if="currentType === 'draft'"
                >删除草稿</el-button
              >
            </div>
          </upper-template>
          <el-table ref="multipleTable" :data="tableData" @row-click="rowclick">
            <el-table-column
              width="55"
              type="selection"
              
            ></el-table-column>
            <el-table-column prop="sender" label="发件人"> </el-table-column>
            <el-table-column prop="title" label="标题">
              <template slot-scope="scope">
                <span v-if="currentType != 'draft' && currentType != 'sent'">
                  <el-tag type="warning" v-if="scope.row.handleFlag == '0'"
                    >未读</el-tag
                  >
                  <el-tag type="success" v-if="scope.row.handleFlag == '1'"
                    >已读</el-tag
                  >
                </span>
                {{ scope.row.title }}
              </template>
            </el-table-column>
            <el-table-column
              prop="content"
              label="正文"
              :formatter="contentFormat"
            >
            </el-table-column>
            <!-- <el-table-column prop="handleFlag" label="是否已读"> </el-table-column> -->
            <el-table-column
              prop="sendTm"
              label="发送时间"
              :formatter="row => this.formatTime(row.sendTm)"
            >
            </el-table-column>
          </el-table>
          <pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            @refresh="searchFunc"
            :current-page="searchForm.page"
            :page-size="searchForm.size"
            :total="total"
          ></pagination>
        </div>
        <el-dialog
          v-dialogDrag
          :title="saveTitles[saveFlg - 1]"
          :visible.sync="addOrEdit"
          width="70%"
        >
          <el-form
            :model="saveForm"
            ref="saveForm"
            label-width="120px"
            label-position="left"
            :rules="saveFormRules"
            :disabled="saveFlg === 3"
          >
            <el-row>
              <el-col :span="24">
                <el-form-item label="标题：" prop="title">
                  <el-input v-model="saveForm.title" maxlength="40"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="收件人：" prop="addressee">
                  <!-- 机构或角色选择时，精确发送收件人不可使用 -->
                  <el-input
                    v-model="saveForm.addressee"
                    readonly
                    maxlength="40"
                    clearable
                    style="cursor: pointer;display: inline-block;width: 70%;"
                    :disabled="dis1"
                    @change="addresseeChange"
                  >
                  </el-input>
                  <el-button
                    icon="el-icon-plus"
                    @click="showAddresseeList"
                    :disabled="dis1"
                    >添加</el-button
                  >
                  <el-button
                    icon="el-icon-close"
                    @click="saveForm.addressee = ''"
                    :disabled="dis1"
                    >清空</el-button
                  >
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="收件人机构：" prop="addresseeOrg">
                  <!-- <el-input
                    v-model="saveForm.addresseeOrg"
                    maxlength="40"
                  ></el-input> -->
                  <!-- 精确发送收件人时，使用机构+角色组合群发不可使用 -->
                  <el-cascader
                    clearable
                    filterable
                    :options="orgList"
                    v-model="saveForm.addresseeOrg"
                    :disabled="dis2"
                    :props="{
                      checkStrictly: true,
                      emitPath: false,
                      multiple: true,
                      expendTrigger: 'hover',
                      value: 'orgName',
                      label: 'orgName'
                    }"
                    :show-all-levels="false"
                    ref="saveOrgTree"
                    style="width:100%"
                    @change="orgAndRoleChange"
                  ></el-cascader>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="收件人角色：" prop="addresseeRole">
                  <!-- 精确发送收件人时，使用机构+角色组合群发不可使用 -->
                  <el-select
                    :disabled="dis2"
                    v-model="saveForm.addresseeRole"
                    placeholder="请选择收件人角色"
                    style="width:100%"
                    multiple
                    @change="orgAndRoleChange"
                  >
                    <el-option
                      v-for="item in roleList"
                      :key="item.roleId"
                      :value="item.roleName"
                      :label="item.roleName"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="11" :offset="1">
                <el-form-item label="发送渠道：" prop="sendChannel">
                  <!-- <el-radio-group v-model="saveForm.sendChannel" size="mini">
                    <el-radio
                      v-for="item in sendChannelList"
                      :label="item.value"
                      :key="item.value"
                      border
                      >{{ item.label }}</el-radio
                    >
                  </el-radio-group> -->
                  <el-select
                    v-model="saveForm.sendChannel"
                    placeholder="请选择发送渠道"
                    style="width:100%"
                  >
                    <el-option
                      v-for="item in sendChannelList"
                      :key="item.value"
                      :value="item.value"
                      :label="item.label"
                      :disabled="item.disabled"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="正文：" prop="content">
                  <quill-editor
                    v-model="saveForm.content"
                    ref="myQuillEditor"
                    :options="editorOption"
                    @blur="onEditorBlur($event)"
                    @focus="onEditorFocus($event)"
                    @change="onEditorChange($event)"
                    v-if="saveFlg != 3"
                  >
                  </quill-editor>
                  <div v-if="saveFlg === 3" v-html="contentView"></div>
                  <span v-if="saveFlg != 3"
                    >当前已输入{{ contentNum }} 个字符，您还可输入{{
                      1000 - contentNum
                    }}个字符。(数字统计包括HTML代码。)</span
                  >
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
          <div slot="footer" class="dialog-footer">
            <el-button type="primary" @click="sendMsgFunc" v-if="saveFlg != 3"
              >发送并保存</el-button
            >
            <el-button @click="saveDraft" v-if="saveFlg != 3"
              >保存至草稿</el-button
            >
            <el-button @click="delFuncOne" v-if="saveFlg === 3">删除</el-button>
            <el-button @click="addOrEdit = false" v-if="saveFlg === 3"
              >关闭</el-button
            >
          </div>
        </el-dialog>

        <el-dialog  title="收件人选择" width="60%" v-dialogDrag :visible.sync="showUsers">
          <user-table ref="userTable" inUse></user-table>
          <div slot="footer">
            <el-button @click="checkUsers">确定</el-button>
            <el-button @click="showUsers = false">关闭</el-button>
          </div>
        </el-dialog>
        <el-dialog title="消息提醒设置" width="514px" v-dialogDrag :visible.sync="isConfig">
          <el-form
            :model="configForm"
            ref="configForm"
            label-width="150px"
            label-position="left"
          >
            <el-form-item
              label="是否提示系统消息："
              :rules="[
                {
                  required: true,
                  message: '请选择是否提示系统消息',
                  trigger: 'blur'
                }
              ]"
            >
              <el-select v-model="configForm.systemFlag" placeholder="请选择">
                <el-option value="1" label="是"></el-option>
                <el-option value="0" label="否"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item
              label="是否提示待办任务："
              :rules="[
                {
                  required: true,
                  message: '请选择是否提示待办任务',
                  trigger: 'blur'
                }
              ]"
            >
              <el-select v-model="configForm.taskFlag" placeholder="请选择">
                <el-option value="1" label="是"></el-option>
                <el-option value="0" label="否"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item
              label="是否提示用户消息："
              :rules="[
                {
                  required: true,
                  message: '请选择是否提示用户消息',
                  trigger: 'blur'
                }
              ]"
            >
              <el-select v-model="configForm.userMsgFlag" placeholder="请选择">
                <el-option value="1" label="是"></el-option>
                <el-option value="0" label="否"></el-option>
              </el-select>
            </el-form-item>
          </el-form>
          <div slot="footer">
            <el-button @click="saveConfig">确定</el-button>
            <el-button @click="isConfig = false">关闭</el-button>
          </div>
        </el-dialog>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import { quillEditor } from "vue-quill-editor"; //调用编辑器
import "quill/dist/quill.core.css";
import "quill/dist/quill.snow.css";
import "quill/dist/quill.bubble.css";
import mement from "moment";
import { systemManage } from "@/api/index";
import userTable from "../SystemMange/userManage";
export default {
  components: {
    quillEditor,
    userTable
  },

  data() {
    return {
      editorOption: {},
      addOrEdit: false,
      showUsers: false,
      isConfig: false,
      currentType: "", //当前页面类型
      dis1: false,
      dis2: false,
      searchStr: "",
      contentView: "",
      searchForm: {
        messageType: "",
        page: 1,
        searchStr: "",
        sendFlag: "",
        size: 15
      },
      saveTitles: ["写通知", "写通知", "查看消息"],
      // 发送渠道
      sendChannelList: [
        { value: "1", label: "系统内消息" },
        { value: "2", label: "第三方邮件", disabled: true }
      ],
      total: 100,
      saveForm: {
        messageId: "",
        messageType: "",
        sendFlag: "",
        status: "",
        title: "",
        addressee: "",
        addresseeOrg: [],
        addresseeRole: [],
        addresseeOrg_text: "",
        sendChannel: "",
        content: ""
      },
      defaultProps: { label: "label", children: "children" },
      saveFormRules: {
        title: [
          { required: true, message: "该输入项为必输项", trigger: "blur" },
          { min: 1, max: 40, message: "标题长度介于1-40之间" }
          // { pattern:/^[0-9a-zA-Z_]{3,32}$/,message:"只能输入3-32位的英文字母、数字、下划线",trigger: "blur"},
        ],
        // addressee: [
        //   { required: true, message: "该输入项为必输项", trigger: "blur" }
        // ],
        sendChannel: [
          { required: true, message: "该选项为必选项", trigger: "blur" }
        ],
        content: [
          { required: true, message: "请输入正文", trigger: "blur" },
          { min: 1, max: 1000, message: "超出最大长度" }
        ]
      },
      // 机构
      orgList: [],
      // 角色下拉
      roleList: [],
      configForm: {
        systemFlag: "",
        taskFlag: "",
        userMsgFlag: ""
      },
      treeData: [
        { id: "0", label: "全部消息", type: "allMsg" },
        { id: "1", label: "系统消息", type: "sysMsg" },
        { id: "2", label: "待办任务", type: "await" },
        { id: "3", label: "用户邮件", type: "userMsg" },
        { id: "4", label: "已发信息", type: "sent" },
        { id: "5", label: "写邮件", type: "write" },
        { id: "6", label: "草稿箱", type: "draft" },
        { id: "7", label: "消息提醒设置", type: "config" }
      ],
      tableData: [],
      editorOption: {
        placeholder: "请在这里输入",
        modules: {
          toolbar: [
            ["bold", "italic", "underline", "strike"], //加粗，斜体，下划线，删除线
            ["blockquote", "code-block"], //引用，代码块
            [{ header: 1 }, { header: 2 }], // 标题，键值对的形式；1、2表示字体大小
            [{ list: "ordered" }, { list: "bullet" }], //列表
            [{ script: "sub" }, { script: "super" }], // 上下标
            [{ indent: "-1" }, { indent: "+1" }], // 缩进
            [{ direction: "rtl" }], // 文本方向
            [{ size: ["small", false, "large", "huge"] }], // 字体大小
            [{ header: [1, 2, 3, 4, 5, 6, false] }], //几级标题
            [{ color: [] }, { background: [] }], // 字体颜色，字体背景颜色
            [{ font: [] }], //字体
            [{ align: [] }], //对齐方式
            ["clean"], //清除字体样式
            ["image"] //上传图片、上传视频
          ]
        }
      }
    };
  },
  computed: {
    contentNum() {
      return this.saveForm.content.length;
    },
    saveFlg() {
      let flg = 1; // 1代表新增 2可编辑 3只能查看
      if (
        this.currentType === "allMsg" ||
        this.currentType === "sysMsg" ||
        this.currentType === "await" ||
        this.currentType === "userMsg" ||
        this.currentType === "sent"
      ) {
        flg = 3;
        this.contentView = this.saveForm.content;
      } else if (this.currentType === "write") {
        flg = 1;
      } else if (this.currentType === "draft") {
        flg = 2;
      } else {
        flg = 3;
      }
      return flg;
    },
    addresseeOrg() {
      return this.saveForm.addresseeOrg;
    },
    addresseeRole() {
      return this.saveForm.addresseeRole;
    },
    addressee() {
      return this.saveForm.addressee;
    }
  },
  watch: {
    addresseeOrg() {
      if (
        (this.saveForm.addresseeOrg &&
          this.saveForm.addresseeOrg.length != 0) ||
        (this.saveForm.addresseeRole && this.saveForm.addresseeRole.length != 0)
      ) {
        this.dis1 = true;
      } else {
        this.dis1 = false;
      }
    },
    addresseeRole() {
      if (
        (this.saveForm.addresseeOrg &&
          this.saveForm.addresseeOrg.length != 0) ||
        (this.saveForm.addresseeRole && this.saveForm.addresseeRole.length != 0)
      ) {
        this.dis1 = true;
      } else {
        this.dis1 = false;
      }
    },
    addressee(v) {
      if (v) {
        this.dis2 = true;
      } else {
        this.dis2 = false;
      }
    }
  },
  mounted() {
    this.getOrganTree();
    this.getroleList();
    this.searchFuncByStr();
  },
  methods: {
    clearSearchForm() {
      for (const key in this.searchForm) {
        this.searchForm[key] = "";
      }
      this.searchForm.page = 1;
      this.searchForm.size = 15;
    },
    // 按输入文字查询
    searchFuncByStr() {
      this.clearSearchForm();
      this.searchForm.searchStr = this.searchStr;
      this.currentType = "allMsg";
      this.searchFunc();
    },
    // 搜索查询
    searchFunc() {
      let data = this.searchForm;
      systemManage.messageQueryForPage(data).then(res => {
        if (res.code == 200) {
          this.tableData = res.datas.rows;
          this.total = res.datas.total;
        }
      });
    },
    // 已发或草稿箱查询，接口不同
    searchSentFunc() {
      let data = this.searchForm;
      systemManage.messageQuerySentedMsgForPage(data).then(res => {
        if (res.code == 200) {
          this.tableData = res.datas.rows;
          this.total = res.datas.total;
        }
      });
    },
    // 获取用户列表
    showAddresseeList() {
      if (this.saveFlg == 3) return;
      this.showUsers = true;
    },
    //获取角色列表
    getroleList() {
      let data = { page: 1, size: 999 };
      systemManage
        .roleManageQuery(data)
        .then(res => {
          if (res.code == 200) {
            this.roleList = res.datas.rows;
          }
        })
        .catch(err => {});
    },
    // 获取机构选择树
    getOrganTree() {
      systemManage.organManageTree().then(res => {
        if (res && res.code == 200) {
          this.orgList = this.$listToTree("orgId", "parentId", res.datas);
        }
      });
    },
    // 机构选择和角色选择
    orgAndRoleChange() {
      let a = this.saveForm.addresseeOrg;
      let b = this.saveForm.addresseeRole;
      if ((a && a.length != 0) || (b && b.length != 0)) {
        this.saveForm.addressee = "";
      }
    },
    addresseeChange() {
      let a = this.saveForm.addressee;
      if (a) {
        this.saveForm.addresseeRole = [];
        this.saveForm.addresseeOrg = [];
      }
    },
    rowclick(row) {
      let obj = { ...row };

      this.saveForm.content = obj.content;
      this.saveForm.sendChannel = obj.sendChannel;
      this.saveForm.addressee = obj.addressee;
      this.saveForm.title = obj.title;
      this.saveForm.status = obj.status;
      this.saveForm.sendFlag = obj.sendFlag;
      this.saveForm.messageType = obj.messageType;
      this.saveForm.messageId = obj.messageId;
      this.saveForm.addresseeOrg_text = obj.addresseeOrg_text;
      this.saveForm.addresseeOrg = obj.addresseeOrg.split(",");
      this.saveForm.addresseeRole = obj.addresseeRole.split(",");
      this.addOrEdit = true;
      this.$nextTick(() => {
        // 不是查看不用联动
        if (this.saveFlg != 3) {
          this.orgAndRoleChange();
          this.addresseeChange();
        }
        // 是查看，则标记已读
        if (this.saveFlg == 3) {
          let arr = [];
          arr.push(obj.messageId);
          let data = { ids: arr };
          systemManage.messageMarkAsRead(data).then(res => {
            if (res.code == 200) {
              // this.$message.success("已标记已读");
              this.searchFunc();
            } else {
              this.$message.error(res.message);
            }
          });
        }
        // 清除校验结果
        this.$refs.saveForm.clearValidate();
      });
    },
    handleNodeClick(obj) {
      this.clearSearchForm();
      // 暂存当前type
      this.currentType = obj.type;
      switch (obj.type) {
        case "allMsg": // 全部消息
          this.searchFunc();
          break;
        case "sysMsg": // 系统消息
          this.searchForm.messageType = "0";
          this.searchFunc();
          break;
        case "await": //待办任务
          this.searchForm.messageType = "1";
          this.searchFunc();
          break;
        case "userMsg": //用户邮件
          this.searchForm.messageType = "2";
          this.searchFunc();
          break;
        case "sent": // 已发
          this.searchForm.sendFlag = "1";
          this.searchSentFunc();
          break;
        case "write": // 写邮件
          this.addOrEdit = true;
          for (const o in this.saveForm) {
            this.saveForm[o] = "";
          }
          this.saveForm.addresseeOrg = [];
          this.saveForm.addresseeRole = [];
          this.$nextTick(() => {
            // 清除校验结果
            this.$refs.saveForm.clearValidate();
          });
          break;
        case "draft": //草稿箱
          this.searchForm.sendFlag = "0";
          this.searchSentFunc();
          break;
        case "config": // 消息提醒设置
          this.isConfig = true;
          this.queryMsgRemConf();
          break;

        default:
          break;
      }
    },
    // 选择用户确定按钮处理
    checkUsers() {
      let selection = this.$refs.userTable.$refs.multipleTable.selection;
      let str = this.saveForm.addressee;
      let userList = [];
      // 选中去重
      let arr = str
        .replace(/</g, "")
        .replace(/>/g, "")
        .split(";");
      console.log(arr);
      for (let i = 0; i < selection.length; i++) {
        let flg = true;
        for (let j = 0; j < arr.length; j++) {
          if (arr[j] == selection[i].userName) {
            flg = false;
          }
        }
        if (flg) {
          userList.push("<" + selection[i].userName + ">");
        }
      }
      let adds = "";
      if (str) {
        // 表单已有字段，添加收件人
        adds = (userList.length != 0 ? "," + userList.toString() : "").replace(
          /,/g,
          ";"
        );
      } else {
        // 表单没有字段，添加收件人
        adds = (userList.length != 0 ? userList.toString() : "").replace(
          /,/g,
          ";"
        );
      }

      this.saveForm.addressee += adds;
      // this.saveForm.addressee = this.saveForm.addressee.replace(',',';')
      this.showUsers = false;
    },
    contentFormat(row) {
      let str = row.content.replace(/<[^<>]+>/g, "");
      return str.length > 20 ? str.substr(0, 20) + "......." : str;
    },
    formatTime(val) {
      return val ? mement(val).format("yyyy-MM-DD HH:MM:SS") : "";
    },
    sendMsgFunc() {
      let data = this.$clone(this.saveForm);
      for (const key in data) {
        data[key] = data[key] ? data[key].toString() : "";
      }
      console.log(data);
      this.$refs["saveForm"].validate(valid => {
        if (valid) {
          systemManage.messageSaveAndSend(data).then(res => {
            if (res.code == 200) {
              this.$message.success("已发送");
              this.addOrEdit = false;
              this.handleNodeClick({ id: "4", label: "已发信息", type: "sent" })
            } else {
              this.$message.error(res.message);
            }
          });
        }
      });
    },
    saveDraft() {
      let data = this.$clone(this.saveForm);
      for (const key in data) {
        data[key] = data[key] ? data[key].toString() : "";
      }
      console.log(data);
      this.$refs["saveForm"].validate(valid => {
        if (valid) {
          systemManage.messageSaveToDrafts(data).then(res => {
            if (res.code == 200) {
              this.$message.success("已保存草稿");
              this.addOrEdit = false;
              this.handleNodeClick({ id: "6", label: "草稿箱", type: "draft" })
            } else {
              this.$message.error(res.message);
            }
          });
        }
      });
    },
    delDraft() {
      let selection = this.$refs.multipleTable.selection;
      if (selection.length < 1) {
        return this.$message.warning("请选择要删除的草稿");
      }
      this.$confirm("您确定要删除选中的草稿吗?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          let data = { ids: selection.map(v => v.messageId) };
          systemManage.messageRemove(data).then(res => {
            if (res.code == 200) {
              this.$message.success("删除成功");
              this.searchSentFunc();
            } else {
              this.$message.error(res.message);
            }
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除"
          });
        });
    },
    delFuncOne() {
      let param = { ids: [this.saveForm.messageId] };
      systemManage.messageRemove(param).then(res => {
        if (res.code == 200) {
          this.$message.success("删除成功");
          this.addOrEdit = false;
          this.searchFunc();
        } else {
          this.$message.error(res.message);
        }
      });
    },
    delFunc() {
      let selection = this.$refs.multipleTable.selection;
      if (selection.length < 1) {
        return this.$message.warning("请选择要删除的信息");
      }
      this.$confirm("您确定要删除选中的邮件吗?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          let data = { ids: selection.map(v => v.messageId) };
          systemManage.messageRemove(data).then(res => {
            if (res.code == 200) {
              this.$message.success("删除成功");
              this.searchFunc();
            } else {
              this.$message.error(res.message);
            }
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除"
          });
        });
    },
    // 保存设置
    saveConfig() {
      this.$refs["configForm"].validate(valid => {
        if (valid) {
          let data = this.configForm;
          systemManage.messageConfigSave(data).then(res => {
            if (res.code == 200) {
              this.$message.success("已保存设置");
              this.isConfig = false;
              this.searchFunc();
            } else {
              this.$message.error(res.message);
            }
          });
        }
      });
    },
// 查询设置 并回显
queryMsgRemConf(){
  systemManage.queryMsgRemConf().then(res=>{
    if(res.code==200){
      this.configForm = res.data
    }
  })
},
   // 标记已读
    tagRead() {
      let selection = this.$refs.multipleTable.selection;
      if (selection.length < 1) {
        return this.$message.warning("请选择要标记的消息");
      }
      let data = { ids: selection.map(v => v.messageId) };
      systemManage.messageMarkAsRead(data).then(res => {
        if (res.code == 200) {
          this.$message.success("已标记已读");
          this.searchFunc();
        } else {
          this.$message.error(res.message);
        }
      });
    },
    // 全部标记已读
    tagReadAll() {
      let data = { messageType: this.searchForm.messageType };
      systemManage.messageMarkAsReadAll(data).then(res => {
        if (res.code == 200) {
          this.$message.success("已全部标记已读");
          this.searchFunc();
        } else {
          this.$message.error(res.message);
        }
      });
    },
    onEditorReady(editor) {
      // 准备编辑器
    },
    onEditorBlur() {
      // 失去焦点事件
    },
    onEditorFocus() {
      // 获得焦点事件
    },
    onEditorChange() {
      // 内容改变事件
    },

    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
      this.searchForm.szie = val;
      if (this.currentType == "draft" || this.currentType == "sent") {
        this.searchSentFunc();
      } else {
        this.searchFunc();
      }
    },
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
      this.searchForm.page = val;
      if (this.currentType == "draft" || this.currentType == "sent") {
        this.searchSentFunc();
      } else {
        this.searchFunc();
      }
    }
  }
};
</script>

<style lang="scss" scoped>
/deep/.ql-container {
  min-height: 150px;
}
</style>